import { View, Text, TouchableOpacity } from 'react-native'
import React, { Component } from 'react'
import Iconfont from '../../../../components/iconfont'
import commonStyle from '../../../../libs/commonStyle'
import BindDialog from './bindDialog'

export default class BindWX extends Component {
	constructor(props) {
		super(props)
		this.state = {
			visible: false
		}
	}

	_onBind() {
		this._setDialogVisible(true)
	}
	_setDialogVisible(flag) {
		this.setState({
			visible: flag
		})
	}
	render() {
		return (
			<View
				style={[
					commonStyle.border,
					commonStyle.shadowGray,
					commonStyle.p20,
					commonStyle.backgroundColorWhite
				]}
			>
				<View
					style={[
						commonStyle.flexRow,
						commonStyle.flexVerticalCenter
					]}
				>
					<Iconfont name="weixin1" size={50} color="#66CC00" />
					<Text
						style={[
							commonStyle.flexItem,
							commonStyle.pl20,
							commonStyle.pr70,
							commonStyle.lineHeight40,
							commonStyle.f26,
							commonStyle.colorGray
						]}
					>
						支持微信提现，提现将转到你的微信零钱
					</Text>
					<View style={[commonStyle.w200, commonStyle.flexCenter]}>
						{!this.props.isBindWx ? (
							<TouchableOpacity
								style={[
									commonStyle.w200,
									commonStyle.h100,
									commonStyle.flexCenter
								]}
								onPress={this._onBind.bind(this)}
							>
								<Text style={[commonStyle.activeColor]}>
									去绑定
								</Text>
							</TouchableOpacity>
						) : (
							<Text style={[commonStyle.f26]}>
								已绑定，可提现
							</Text>
						)}
					</View>
				</View>
				<BindDialog
					wxPublic={this.props.wxPublic}
					visible={this.state.visible}
					setVisible={this._setDialogVisible.bind(this)}
				/>
			</View>
		)
	}
}
